<!DOCTYPE html>
<html lang="en">

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="UTF-8">
    <title>预约套餐页面</title>
    <script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.4/??flexible_css.js,flexible.js"></script>
    <link href="http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">    
    <link rel="stylesheet" href="{{url('/css/main.css')}}">
    <script src="{{url('js/lCalendar.js')}}"></script>
    <link rel="stylesheet" href="{{url('css/lCalendar.css')}}">
    <script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.js"></script>
    <!-- Noty 提示框的js集成 -->
    <script src="{{ url('vendor/noty-2.2.9/packaged/jquery.noty.packaged.js') }}"></script>
    <script src="{{ url('vendor/noty-2.2.9/themes/bootstrap.js') }}"></script>
    <script src="{{ url('vendor/noty-2.2.9/options.js') }}"></script>
</head>

<body>
    <div id="body">
        <div class="page-header">
          <h4>@if($package){{$package->pak_name}}@endif</h4>
        </div>
        <!-- 日历 -->
        <div class="confirm-container ui-beautify">
            <div class="title">套餐费：￥@if($package){{$package->consulting_fee}}@endif</div>
            <div class="title">预约金：￥@if($package){{$package->bespeak_fee}}@endif</div>
            <div class="date-wrapper">
            	<!-- 星期几 渲染后7天 -->
                <div class="single-date weeks">
                    <span></span>
                </div>
                <div class="single-date weeks">
                    <span></span>
                </div>
                <div class="single-date weeks">
                    <span></span>
                </div>
                <div class="single-date weeks">
                    <span></span>
                </div>
                <div class="single-date weeks">
                    <span></span>
                </div>
                <div class="single-date weeks">
                    <span></span>
                </div>
                <div class="single-date weeks">
                    <span></span>
                </div>
                <!-- 日期 -->
                <div class="single-date day selected">
                    <span value="<?php echo date('Y-m-d',time()+ 60*60*24);?>"><?php echo date('d',time()+ 60*60*24).'号';?></span>
                    <span class="glyphicon glyphicon-ok"></span>
                </div>
                @for($i = 2 ;$i <8;$i++)
                    <div class="single-date day">
                        <span value="<?php echo date('Y-m-d',time()+ 60*60*24*$i);?>"><?php echo date('d',time() + 60*60*24*$i).'号';?></span>
                        <span class="glyphicon glyphicon-ok"></span>
                    </div>
                @endfor
            </div>

            </div>

        <div class="data-get-container">
            <form action="">
                <label for="">
                    <span>姓名</span>
                    <input  type="text" placeholder="请输入信息" value="@if($user_info){{$user_info->realname}}@endif">
                </label>
                <label for="">
                    <span>手机号</span>
                    <input type="text" placeholder="请输入信息" value="@if($user_info){{$user_info->phone}}@endif">
                </label>
                <label for="">
                    <span>出生日期</span>
                    <input id="birthday" type="text" placeholder="请输入信息" value="{{date('Y-m-d',strtotime($user_info->birthday))}}">
                </label>
                <input id="submin-btn" type="button" class="btn btn-warning" value="提交预约">
            </form>
        </div>
    </div>
    <script>

        var calendar = new lCalendar();
        calendar.init({
            'trigger': '#birthday',
            'type': 'date'
        });
        var _token = "<?php echo csrf_token();?>";
        // 是否显示过提示
        var flag = false;

        function WXPayment(configJSON) {
            if (typeof WeixinJSBridge === 'undefined') {
                alert('请在微信在打开页面！');
                return false;
            }
            WeixinJSBridge.invoke('getBrandWCPayRequest', configJSON, function (res) {
                switch (res.err_msg) {
                    case 'get_brand_wcpay_request:cancel':
                        alert('用户取消支付！');
                        break;
                    case 'get_brand_wcpay_request:fail':
                        alert('支付失败！（' + res.err_desc + '）');
                        break;
                    case 'get_brand_wcpay_request:ok':
                        noty({text:'支付成功',type:'success',timeout:600,
                            callback:{
                                afterClose:function(){
                                    window.location.href='{{route('M.Home.orderList')}}';
                                }
                            }
                        });
                        break;
                    default:
                        alert(JSON.stringify(res));
                        break;
                }
            });
        }

        $(function() {
            var weeks = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
            var today = new Date().getDay();
            var res = weeks.slice(today + 1).concat(weeks.slice(0, today + 1));
            $.each(res, function(index, obj) {
                $('.single-date.weeks').eq(index).children('span').text(obj);
            })

        })


        // 选择日期
        $(".single-date.day").click(function() {
            var _index = $.makeArray($('.day')).indexOf($(this)[0]);
            $('.single-date.day').eq(_index).addClass('selected').siblings().removeClass('selected');
            var show_obj = $('.single').eq(_index);
            if (show_obj) {
                show_obj.show().siblings('.single').hide();
            }
        })
        // 确定预约时间
        $('.time-line').click(function() {
            if ($(this).hasClass('disable')) {
                return false;
            }
            $(this).addClass('hadchosed').siblings().removeClass('hadchosed');
            var ind = parseInt($(this).data('index'));
            var parent = $(this).parents('.single')[0];

        })

        $('#submin-btn').click(function () {
            $.post('/api/submint-package-bespoke', {
                _token:_token,
                name:"{{$user_info->realname}}",
                born:"{{date('Y-m-d',strtotime($user_info->birthday))}}",
                phone:"{{$user_info->phone}}",
                pack_id:"{{$package->id}}",
                time:$('.single-date.day.selected').children('span').attr('value'),
            },function (data, res) {
                if (data.level == 'success'){
                    $.post('/api/wechat/wpay',{
                        _token:_token,
                        order_num:data.data.order_num
                    },function(data,res){
                        WXPayment(data.data);
                    });
                }
            });
        });

    </script>
</body>

</html>
